<template>
  <div class="login" style="height: 100%">
    <div class="layui-carousel" style="height: 80%" id="carouselLogin">
      <div carousel-item>
        <div class="layui-container" style="width: 100%; padding: 0">
          <div class="layui-row">
            <div class="layui-col-xs12">
              <img
                width="100%"
                height="100%"
                alt=""
                src="../../../assets/image/banner_01.jpg"
              />
            </div>
          </div>
        </div>
        <div class="layui-container" style="width: 100%; padding: 0">
          <div class="layui-row">
            <div class="layui-col-xs12" style="width: 100%">
              <img
                width="100%"
                height="100%"
                alt=""
                src="../../../assets/image/banner_02.jpg"
              />
            </div>
          </div>
        </div>
        <div class="layui-container" style="width: 100%; padding: 0">
          <div class="layui-row">
            <div class="layui-col-xs12" style="width: 100%">
              <img
                width="100%"
                height="100%"
                alt=""
                src="../../../assets/image/banner_03.jpg"
              />
            </div>
          </div>
        </div>
      </div>
    </div>
    <div
      class="layui-container"
      style="position: absolute; width: 32%; z-index: 100; top: 25%; right: 34%"
    >
      <div
        class="layui-tab layui-tab-brief"
        style="
          margin: 1.1vw 0px;
          border-radius: 0.2vw;
          border-width: 0.1vw;
          box-shadow: 0 0.2vw 0.2vw 0 rgba(0, 0, 0, 0.1);
          background-color: #fff;
        "
      >
        <ul class="layui-tab-title">
          <li
            class="layui-this"
            style="font-size: 0.8vw; padding: 0; width: 100%"
          >
            系统管理员账号登录
          </li>
        </ul>
        <div class="layui-tab-content">
          <div class="layui-tab-item layui-show">
            <div class="layui-row">
              <div
                class="layui-col-xs6 layui-col-sm6 layui-col-md6"
                style="border-right: 1px #9a9a9a solid"
              >
                <loginInfo></loginInfo>
              </div>
              <form
                id="loginForm"
                class="layui-form"
                action="/api/login/user.do"
                method="post">
                <div class="layui-col-xs6 layui-col-sm6 layui-col-md6">
                  <div style="text-align: center;margin-top: 1vw;">
                      CMS后台管理系统
                  </div>
                  <div class="container-login">
                    <div class="register-box">
                      <ul>
                        <li class="item01">
                          <input
                            type="text"
                            v-model.trim="userLoginData.username" @keyup.enter="userLogin"
                            lay-verify="required|username"
                            lay-reqText="请输入用户名"
                            style="background-size: 1vw"
                            placeholder="请输入用户名"
                          />
                        </li>
                        <li class="item02">
                          <input
                            type="password"
                            v-model.trim="userLoginData.password" @keyup.enter="userLogin"
                            lay-verify="required|pass"
                            style="background-size: 1vw"
                            lay-reqText="请输入密码"
                            placeholder="请输入密码"
                          />
                        </li>
                      </ul>
                      <div class="clearboth" style="margin-top: 5%;"></div>
                      <button
                        v-on:click="userLogin"
                        type="button"
                        lay-filter="login" style="width: 70%;"
                        lay-submit   class="layui-btn layui-btn-sm layui-btn-normal"
                      >
                        登录
                      </button>
                    </div>
                  </div>
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="footer">
      <div>{{ contact }}</div>
      <div>{{ technology }}</div>
      <div>{{ copyright }}</div>
    </div>
  </div>
</template>
<style lang="less" scoped>
@import "../../../assets/css/login.css";
</style>
<script>
import loginInfo from "@/components/manager/login/children/loginInfo";
export default {
  name: "ManagerIndex",
  components: {
    loginInfo,
  },
  data: function () {
    return {
      contact: "email:lpx951002@163.com",
      technology:
        "This project uses the front-end components of layui and Vue framework",
      copyright:
        "Copyright © 2004 Adobe Systems Incorporated. All rights reserved.",
      userLoginData: {
        username: "",
        password: "",
      },
    };
  },
  beforeMount: function () {},
  mounted: function () {
    document.getElementsByTagName("body")[0].style.height =
      window.innerHeight + "px";
    layui.use(["carousel", "element"], function () {
      var carousel = layui.carousel;
      var element = layui.element;
      //建造实例
      carousel.render({
        elem: "#carouselLogin",
        width: "100%", //设置容器宽度
        arrow: "hover", //始终显示箭头
        anim: "default", //切换动画方式
        autoplay: true,
        indicator: "none",
        height: "100%",
        interval: 3000,
      });
    });
    this.initLayui();
  },
  methods: {
    userLogin: function () {
      if (this.checkIsNull(this.userLoginData.username)) {
        this.showMsg("请输入用户名",false);
        return;
      }
      if (this.checkIsNull(this.userLoginData.password)) {
        this.showMsg("请输入密码",false);
        return;
      }
      var obj = {};
      obj.username = this.userLoginData.username;
      obj.password = this.getRsaData(this.userLoginData.password);
      let _this = this;
      // this.post(this.userService+"/login/user.do", obj, function (data) {
      this.post(this.managerUserLogin+"/login", obj, function (data) {
        var ses = window.sessionStorage;
        if(data.status.code !="000000"){
            _this.showMsg(data.status.msg);
            return;
        }
        data = data.result;
        //获取回跳地址
        var toPath;
        toPath = "/userManager/index";
        ses.setItem("token", data.sessionId);
        _this.$cookies.set("sessionId", data.sessionId, 60 * 30);
        //返回回跳地址
        _this.$router.push({
          path: toPath,
        });
      });
    },
  },
};
</script>